<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="css/hari.css" />


<style >

h2{
font-size: 80px;
color: green;
border: medium ;
border-color: red;
border-style: solid;
background-color: yellow;

}

.hello{
font-size: 40px !important;
font-family:fantasy;
color: green;
border: medium ;
border-color: red;
border-style: dashed;
background-color: yellow;

}

.anotherClass{
font-size: 30px ;
font-family:fantasy;
color: olive !important;
border: medium ;
border-color: red;
border-style: dotted;
background-color: lime;

}

#myStyle{
font-size: 30px ;
font-family:cursive ;
color: fuchsia !important;
border: medium ;
border-color: orange;
border-style: ridge;
background-color:navy;
}

</style>
</head>
<body>

<h2>Hello this is modified h2</h2>

<p>Hi, this is a paragraph without any styles </p>

<p class="hello anotherClass">Hi, this is a paragraph with  style class "hello" </p>

<h1 id='myStyle'>This is custom H1 with CSS class</h1>

<p class="hello anotherClass">Hi, the styles look really impressive. </p>
</body>
</html>